<script lang="ts" setup>
import { defineAsyncComponent } from 'vue';
import useStore from '@/store';
import { storeToRefs } from 'pinia';
import { useRoute } from 'vue-router';
import CommentBar from '@/components/CommentBar.vue';
const { user, comments } = useStore();
const { user_id } = storeToRefs(user);
const { list, nowPost } = storeToRefs(comments);
const { getAllCommentOfPost } = comments;
const detailBar = defineAsyncComponent(() => import('@/components/DetailBar.vue'));
const DTitle = defineAsyncComponent(() => import('@/components/DTitle.vue'));
const commentBar = defineAsyncComponent(() => import('@/components/CommentBar.vue'));
const id = parseInt(useRoute().params.id as string);
getAllCommentOfPost(id, 1);
</script>

<template>
	<div class="detail">
		<d-title :title="nowPost.postTitle"></d-title>
		<detail-bar></detail-bar>
		<template v-for="(item, index) in list" :key="index">
			<comment-bar :prime="true" :idx="index"></comment-bar>
		</template>
	</div>
</template>

<style lang="scss" scoped>
</style>
